<% location_id = @location.id
connected_subnets = @ps.connected_subnets
connected_subnet_ids = connected_subnets.map(&:id)
connectable_subnets = @ps.project
  .private_subnets_dataset
  .where(location_id:)
  .exclude(id: @ps.id)
  .exclude(id: connected_subnet_ids)
connectable_subnets = dataset_authorize(connectable_subnets, "PrivateSubnet:connect").all
connected_subnet_ds = PrivateSubnet.where(id: connected_subnet_ids)
supports_disconnect = has_permission?("PrivateSubnet:disconnect", @ps.id)

@ps.firewalls(eager: :location)
perm_checks = {
  "Firewall:view" => Firewall.where(id: @ps.firewalls.map(&:id)),
  "PrivateSubnet:view" => connected_subnet_ds,
  "PrivateSubnet:disconnect" => connected_subnet_ds
}

ps_path = path(@ps)

viewable_fws, viewable_subnets, disconnectable_subnets =
  DB.ignore_duplicate_queries do
    perm_checks.map do |perm, ds|
      dataset_authorize(ds, perm).select_hash(:id, Sequel.as(true, :v))
    end
  end %>

<div class="p-6">
  <%== part(
    "components/table_card",
    title: "Attached Firewalls",
    headers: %w[Name Description],
    empty_state: "No firewall attached",
    rows:
      @ps.firewalls.map do |fw|
        [
          [
            (
              if viewable_fws[fw.id]
                [fw.name, { link: path(fw) }]
              else
                fw.name
              end
            ),
            fw.description
          ],
          { id: "fw-#{fw.ubid}" }
        ]
      end
  ) %>
  <!-- Connected Private Subnets List -->
  <div class="mt-6 md:flex md:items-center md:justify-between pb-2 lg:pb-4">
    <div class="min-w-0 flex-1">
      <h3 class="text-2xl font-bold leading-7 text-gray-900 sm:truncate sm:text-2xl sm:tracking-tight">
        Connected Subnets
      </h3>
    </div>
  </div>
  <div class="overflow-hidden rounded-lg shadow ring-1 ring-black ring-opacity-5 bg-white divide-y divide-gray-200">
    <table class="min-w-full divide-y divide-gray-300">
      <thead class="bg-gray-50">
        <tr>
          <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6">Name</th>
          <th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"></th>
        </tr>
      </thead>
      <tbody class="divide-y divide-gray-200 bg-white">
        <% connected_subnets.each do |subnet| %>
          <%
            viewable = viewable_subnets[subnet.id]
            show_delete = disconnectable_subnets[subnet.id]
          %>
          <tr>
            <td class="whitespace nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-6" scope="row">
              <% if viewable %>
                <a href="<%= path(subnet) %>" class="text-orange-600 hover:text-orange-700"><%= subnet.name %></a>
              <% else %>
                <%= subnet.name %>
              <% end %>
            </td>
            <td
              id="cps-delete-<%= subnet.ubid %>"
              class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6"
            >
              <% if show_delete && supports_disconnect %>
                <%== part(
                  "components/delete_button",
                  url: "#{ps_path}/disconnect/#{subnet.ubid}",
                  confirmation_message: "Are you sure to disconnect?",
                  redirect: ps_path,
                  method: "POST",
                  text: "Disconnect"
                ) %>
              </td>
            <% end %>
          </tr>
        <% end %>
        <% if !connectable_subnets.empty? && has_permission?("PrivateSubnet:connect", @ps.id) %>
          <tr>
            <td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-6" scope="row">
              <%== part(
                "components/form/select",
                name: "connected-subnet-id",
                label: "",
                placeholder: "Pick a subnet to connect",
                options: connectable_subnets.map { |s| [s.ubid, s.name] }.sort_by(&:last),
                attributes: {
                  form: "form-connect-subnet"
                }
              ) %>
            </td>
            <td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6">
              <% form(action: "#{ps_path}/connect", method: :post, id: "form-connect-subnet") do %>
                <%== part("components/form/submit_button", text: "Connect") %>
              <% end %>
            </td>
          </tr>
        <% end %>
      </tbody>
    </table>
  </div>
</div>
